{% extends "tj3/tj3.html" %}

{% block navigation %}
<script type="text/javascript">
	var table;
	var json_table = new google.visualization.DataTable({{json_table|safe}}, 0.6);
	var task_id;
	
	function drawTable() {
		table = new google.visualization.Table(document.getElementById('table_div'));
		// Every time the table fires the "select" event, it should call your
		// selectHandler() function.
		google.visualization.events.addListener(table, 'select', selectHandler);
		table.draw(json_table, 
			{showRowNumber: false, 
			page:"enable", 
			allowHtml:true, 
			sort:'disable', // Must be disabled since we are reserving the hierarchy 
			pageSize:20,
			width:400,
		});
	}

	function selectHandler(e){
		var selection = table.getSelection();
		var str;
	
		for (var i=0; i < selection.length; i++) {
			var item=selection[i];
			if (item.row!=null && item.column!=null) { // select a cell
				str = json_table.getValue(item.row,item.column);
	
			}else if (item.row != null) { // select a row
				str = json_table.getValue(item.row,0);
	
			}else if (item.column != null) { // select a column
				str = json_table.getValue(0,item.column);
			}
		}
		//alert(window.location.href);
	
		// getValue(0,0) should be the task_id
		task_id=json_table.getValue(item.row,0);
		$('#to_task').val(task_id);
	}   
	
	$('document').ready(function(){
		drawTable();	
	
		var type="{{dep.type}}";
		if (type=="depends"){
			$('input[value=depends]').attr('checked', 'checked');
		}
		if (type=='precedes'){
			$('input[value=precedes]').attr('checked', 'checked');
		}
		
		var type="{{dep.on_what}}";
		if (type=="onstart"){
			$('input[value=onstart]').attr('checked', 'checked');
		}
		if (type=='onend'){
			$('input[value=onend]').attr('checked', 'checked');
		}
		
		$('#update_btn').button();
		$('#delete_btn').button();
		
	});
		
</script>
{% endblock navigation %}


{% block content  %} 


<h1 class="ui-widget ui-widget-header">{{project.name}}/{{task.name}}<span class="float_right">Editing Dependency</span></h1>

Clicking on a task in the table will change to whom this task is relating.


	<table>
	<tr>
	<td>
		<div id="table_div" class="ui-widget ui-widget-content">
			{% csrf_token %}
		</div>
	<td>	
		<div id="dep_info" class="mycontent">
			<div>
				<span class="ui-icon ui-icon-extlink" style="float: left; margin-right: .3em;"></span>
				<a href="{% url task_detail dep.from_task.id%}">Back to the task details...</a>
			</div>
			
			<form id="update_form" action="" method="post" enctype="multipart/form-data">		
			<table>
				<tr><td>To Task:<td>
						<input id="to_task" type="text" name="to_task" value="{{dep.to_task.id}}">			
				<tr><td>Type:<td>
						<input id="depends" type="radio" name="type" value="depends">depends</input>
						<input id="precedes" type="radio" name="type" value="precedes">precedes</input>
				<tr><td>On:<td>
						<input id="onstart" type="radio" name="on_what" value="onstart">on start</input>
						<input id="onend" type="radio" name="on_what" value="onend">on end</input>
			</table>
			<br />

			Gap in Working Time:
			<input id="length" type="text" name="length" value="{{dep.gap_length}}">
			<br />
			<span class="fancy float_right">Ex: 1d, 2w, 3m</span>
			<br />
			Gap in Calendar Time:
			<input id="duration" type="text" name="duration" value="{{dep.gap_duration}}">												
			<br />
			
			<input id="update_btn" type="submit" name="command" value="Update" class="button" />
			<input id="delete_btn" type="submit" name="command" value="Delete" class="button" />				

			</form>
		</div>
	</table>
	
<h1 class="ui-state-highlight ui-corner-all">Go To<h1>
<div>
	<ul>
		<li><a href="{%url task_detail task.id%}"><b>Task Details</b></a>
		<li><a href="{%url project_main_plan project.id%}">Project Planning</a>
	</ul>
</div>
{% endblock content %}
